<template>
  <el-container>
    <SiteTree style="position: fixed" @on-choose-region="filetrStation" />
    <el-main class="realTimeCabinetContent">
      <CabinetList v-if="state.Show" v-model="state.lastData" />
      <div v-else>请选择左侧站点数据</div>
    </el-main>
  </el-container>
</template>
<script lang="ts" setup>
import { provide, onMounted, computed, reactive } from "vue";
import SiteTree from "./components/aside.vue";
import { useConfig } from "@/store/config"; //后台布局相关仓库
import { useAssetSite } from "@/store/backend/Assets/site";
import { useDictionary } from "@/store/backend/tool/dictionary";
import { DictOperation } from "@/utils/common"; // 导入表格api方法生成器
import CabinetList from "./components/cabinetList.vue";
import { useElectricData } from "@/store/backend/DataM/RealTime";
import { useAssetCabinet } from "@/store/backend/Assets/cabinet";
import { useWarningItemObject } from "@/store/backend/Warning/itemObject";

const config = useConfig();
const site = useAssetSite();
const dictionary = useDictionary();
const realTime = useElectricData();
const cabinet = useAssetCabinet();
const itemObject = useWarningItemObject();

const state: {
  Show: boolean;
  isOpen: boolean;
  lastData: any[];
} = reactive({
  Show: false,
  isOpen: false,
  lastData: [],
});

//初始化字典处理类
const dictOperation = new DictOperation();
//获取字典
const getDictionary = () => {
  //获取机柜类型的字典
  dictOperation.getDictionary(
    cabinet,
    "sys_cabinet_type",
    "cabinetType",
    "type"
  );
  //获取5g小脑工作模式字典
  dictOperation.getDictionary(
    realTime,
    "sys_realtime_mode",
    "mode",
    "typeMode"
  );
  //获取5g小脑泵状态字典
  dictOperation.getDictionary(realTime, "sys_realtime_beng", "fp1", "typefp1");
  //获取5g小脑风机状态字典
  dictOperation.getDictionary(realTime, "sys_realtime_fan", "wf1", "typewf1");
};
getDictionary();

//监控右侧宽度
const menuWidth = computed(() => config.overviewMenuWidth());

//查询实时数据
const getLast = (arr: any) => {
  realTime
    .getLast(arr)
    .then((res: any) => {
      state.Show = true;
      state.lastData = res.rows;
    })
    .catch((err: any) => {
      console.log("查询实时数据失败", err);
    });
};
//接收站点树传递过来的数据
const filetrStation = (row: any, node: any) => {
  console.log("接收站点树传递过来的数据", row, node);
  if (node && node.checkedKeys.length !== 0) {
    getLast({ siteIds: node.checkedKeys });
  }
  if (node && node.checkedKeys.length === 0) {
    //表示取消选择直接调用刷新表单方法
  }
  //全选
  if (!node && row.length !== 0) {
    getLast({ siteIds: row });
  }
  //全不选
  if (!node && row.length === 0) {
  }
};

//获取告警对象列表
const getobjectList = () => {
  itemObject
    .getWarningItemObjectList({ pageSize: 10000 })
    .then((res: any) => {
      itemObject.fullData = res; //所有告警对象数据存储至仓库
    })
    .catch((err: any) => {});
};
getobjectList(); //获取告警对象列表

onMounted(() => {});

provide("site", site);
provide("dictionary", dictionary);
provide("config", config);
provide("dictOperation", dictOperation);
provide("cabinet", cabinet);
provide("itemObject", itemObject);
</script>

<style lang="scss" scoped>
.el-main {
}
.default-main {
  margin: var(--ba-main-space) var(--ba-main-space) 20px var(--ba-main-space);
}
.realTimeCabinetContent {
  margin-left: v-bind(menuWidth);
}
</style>
